<!doctype html>
<html>
	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" href="https://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css">
		<script src="https://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
		<script src="https://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
		<link rel="shortcut icon" href="../favicon.ico">	
		<style type="text/css">
      * {
        touch-action: pay-y;
      }
			body{
				font-family:Arial, Helvetica, sans-serif, 微软雅黑;
			}
			#content{
				font-size:15px;
				padding:0px;
				margin:0px;
			}
			.ui-block-a, .ui-block-b, .ui-block-c {
        height: 30px;
        text-align: center;
        padding-top: 5px;
        border-bottom: 1px solid;
      }
		</style>
    <script type="text/javascript">
      // $(function() {
        $(document).on('pagecreate', function() {
          console.log("pagecreate");
          });
        $(document).on('pageinit', function() {
          console.log("pageinit");
          $('#orideritem').html(localStorage.orideritem);
          $('#flavor').html(localStorage.flavor);
          $('#num').html(localStorage.num);
        });
      // });
      function deleteOrider() {
        localStorage.clear();
        $('.ui-grid-b').html("已取消订单！");;
      }
      
    </script>
	</head>
	<body>
		<div data-role="page" data-title="订单列表" id="first" data-theme="a" data-add-back-btn="true">
			<div data-role="header">
				<a href="index.html" data-icon="arrow-l" data-iconpos="left" data-ajax="false">
					回首页
				</a>
				<h1>订单列表</h1>
			</div>
			<div data-role="content" id="content">
        <a href="#" data-role="button" data-inline="true" onclick="deleteOrider();">删除订单</a>
        以下为您的订购列表：
				<div class="ui-grid-b">
          <div class="ui-block-a ui-bar-a">甜品种类</div>
          <div class="ui-block-b ui-bar-b">口味</div>
          <div class="ui-block-c ui-bar-c">订购数量</div>
          <div class="ui-block-a ui-bar-a" id="orideritem"></div>
          <div class="ui-block-b ui-bar-b" id="flavor"></div>
          <div class="ui-block-c ui-bar-c" id="num"></div>
        </div>
      </div>
			<div data-role="footer" data-position="fixed" style="text-align:center">
				订购专线：45454545
			</div>
		</div>
		
	</body>
</html>